<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>徽章与巨幕</title>
		<link rel="stylesheet" href="css/bootstrap.min.css" />
	</head>

	<body>
		<!--
			巨幕: 建议把内容放到 container当中
		-->
		<div class="jumbotron">
			<div class="container">
				<h1>淘学网</h1>
				<p>欢迎来到淘学网 欢迎来到淘学网 欢迎来到淘学网 欢迎来到淘学网欢迎来到淘学网</p>
				<p><a class="btn btn-info btn-lg" href="#" role="button">Leanr more</a></p>
			</div>
		</div>
		<div class="container">
			<a href="#">短消息<span class="badge">30</span></a>
			<!--
				一button的方式进行呈现  IE 8 不支持
			-->
			<button class="btn-success" type="button">Messages<span class="badge">30</span></button>
		</div>
		<ul class="nav nav-pills" role="rablist">
			<li role="presentation" class="active"><a href="#">Home<span class="badge">20</span></a></li>
			<li role="presentation"><a href="#">Home<span class="badge">20</span></a></li>
			<li role="presentation"><a href="#">Home<span class="badge">20</span></a></li>
		</ul>
	</body>

</html>